<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
		<meta name="format-detection" content="telephone=no">
		<script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/jquery.min.js{$Think.config.RESOURCE_VER}"></script>
		<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
		<script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/wx_share.js{$Think.config.RESOURCE_VER}"></script>
		<script src="{$Think.config.RESOURCEURL}wx_assets/js/util.js{$Think.config.RESOURCE_VER}" type="text/javascript"></script>
		<link rel="stylesheet" type="text/css" href="{$Think.config.RESOURCEURL}wx_assets/css/common.css?v=201408281">
		<title>优惠券</title>
	</head>
	<style>
		body{
			background-color:#F65392;
			color:#333;
		}
		.container{
			margin:20px 10px;
			background-color:white;
		}
		.mallInfo{
			padding:10px;
			border-bottom:1px dashed #ccc;
			position:relative;
		}
		.mallInfo:before{
			content: "";
			display: block;
			position: absolute;
			left: -5px;
			bottom: -5px;
			width: 10px;
			height: 10px;
			background-color: #F65392;
			border-radius: 50%;
		}
		.mallInfo:after{
			content: "";
			display: block;
			position: absolute;
			right: -5px;
			bottom: -5px;
			width: 10px;
			height: 10px;
			background-color: #F65392;
			border-radius: 50%;
		}
		.mallInfo>img{
			max-height: 63px;;
			margin-right:10px;
		}
		.mallInfo>span{
			line-height:63px;
			vertical-align: top;
		}
		.name{
			line-height: 40px;
			text-align: left;
			font-size: 16px;
			padding: 0 10px;
		}
		.price{
			line-height:28px;
			text-align: center;
			color:#F65392;
			font-size: 50px;
			font-weight: 700;
			padding-bottom: 10px;
		}
		.price>span{
			font-size:16px;
		}
		.recommend{
			padding:10px;
			background-color:#F698BC;
			color:white;
			font-size:16px;
			line-height: 26px;
		}
		a{
			display:block;
			background-color:#F8CC53;
			color:white;
			font-size:16px;
			text-align: center;
			border-radius:5px;
			margin:20px 10px;
			height:40px;
			line-height:40px;
		}
		.share,.receive{
			position:fixed;
			top:0;
			width:100%;
			height:100%;
			background-color:rgba(0,0,0,.8);
			display:none;
		}
		.receive>div,.share>div{
			width:80%;
			position:absolute;
			top:50%;
			left:50%;
			transform: translate(-50%,-50%);
			-webkit-transform: translate(-50%,-50%);
			padding:20px 30px;
			box-sizing:border-box;
			background:-webkit-gradient(linear, 0% 0%, 0% 100%,from(#FE5A3E), to(#FF2E65));
		}
		.receive>div{
			padding:0;
			text-align: center;
			background:white;
		}

		.receive>div img{
			width:100%;
			height:180px;
		}
		.receive>div a{
			background-color:#FE3263;
			color:white;
		}
		.share>div img{
			max-height:150px;
			max-width:150px;
			border-radius:50%;
			margin:40px auto;
			display:block;
		}
		.share>img{
			position: fixed;
			top: 0;
			right: 10px;
			width:40px;
		}
		.share h2{
			color:white;
			font-size:16px;
			text-align: center;
		}
		a.disabled{
			background-color:#ccc;
			color:white;
		}
	</style>
	<body>
		<div class="container">
			<div class="mallInfo">
				<img src="{$mallInfo.logo}">
				<span>{$mallInfo.name}</span>
			</div>
			<div class="name">{$couponInfo.name}</div>
			<div class="price"><span>￥</span>{$couponInfo.money|floatval}</div>
			<div class="recommend">
				<div>{$couponInfo.recommend}</div>
				<if condition="$couponInfo.isEffective eq '1'">
					<div>{$couponInfo.startTime}至{$couponInfo.endTime}有效</div>
				</if>
			</div>
		</div>
		<if condition="$couponInfo.openid eq $userName">
			<if condition="$couponInfo.status neq 0">
				<a class="disabled">分享</a>
				<else/>
				<a id="share">分享</a>
			</if>

			<else/>
			<if condition="$couponInfo.status neq 0">
				<a class="disabled">领取</a>
				<else/>
				<a id="receive">领取</a>
			</if>
		</if>
		<div class="share">
			<img src="{$Think.config.RESOURCEURL}wx_assets/coupon/up.gif{$Think.config.RESOURCE_VER}"/>
			<div>
				<h2>发送给好友</h2>
				<img src="{$Think.config.RESOURCEURL}wx_assets/coupon/share.gif{$Think.config.RESOURCE_VER}">
				<a>我知道了</a>
			</div>
		</div>
	<div class="receive">
		<div>
			<img src="{$Think.config.RESOURCEURL}wx_assets/coupon/receive.gif{$Think.config.RESOURCE_VER}"/>
			<div>优惠券已经放入你的账户中</div>
			<a id="show">立即查看</a>
		</div>
	</div>
	</body>
	<script>
        var baseUrl = '{$Think.config.SERVER_HOST}';
		$("#share").click(function(){
			$(".share").show();
		});
		$(".share a").click(function(){
		    $(".share").hide();
		});
		$("#receive").click(function(){
            $.req.get("call.json?customerId={$customerId}&module=product&method=receiveShareCoupon" , {
                params: {
                    "id": '{$couponInfo.id}'
                }
            }, function(data) {
                if(data.code==0){
                    $(".receive").show();
				}else{
                    $.util.showMsg(data.msg);
				}
			});
		});
		$("#show").click(function(){
            location.href  = baseUrl+'call.html?customerId={$customerId}&module=product&method=couponList&params=%7B%22type%22:0%7D';
		})
	</script>
<script>
    var p=$.util.getParamAsObject();
	var title = "{$couponInfo.nickname}"||"朋友";
    var shareUrl='';
    if(p.qId&&p.miUid){
        params=encodeURIComponent(JSON.stringify(p));
        shareUrl = baseUrl+'call.html?customerId={$customerId}&module=product&method=couponInfo&params='+params;
	}else if('{$quanInfo.qId}'&&'{$quanInfo.uId}'){
        p.qId='{$quanInfo.qId}';
        p.miUId = '{$quanInfo.uId}';
        params=encodeURIComponent(JSON.stringify(p));
        shareUrl = baseUrl+'call.html?customerId={$customerId}&module=product&method=couponInfo&params='+params;
	}else{
        params=encodeURIComponent(JSON.stringify(p));
        shareUrl = baseUrl+'call.html?customerId={$customerId}&module=product&method=couponInfo&params='+params;
	}

	wx_share.init({
				"title":title+"送你{$couponInfo.money|floatval}元优惠券",
				"desc":'{$couponInfo.name}',
				"link":shareUrl,
				"imgUrl":'{$Think.config.RESOURCEURL}wx_assets/coupon/share_icon.jpg{$Think.config.RESOURCE_VER}',
				"pkg":{
					"appId": '{$pkg.appId}',
					"timestamp": '{$pkg.timestamp}',
				"nonceStr": '{$pkg.nonceStr}',
				"signature": '{$pkg.signature}'
			}
	});
</script>
</html>
